<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" href="./css/font-awesome.min.css"/>
		<link rel="stylesheet" href="./floatingChat.css"/>
	</head>
	<body>
		<div class="floating-chat enter">
		    <i class="fa fa-comments" aria-hidden="true"></i>
		    <div class="chat">
		        <div class="header">
		            <span class="title">
		                what's on your mind?
		            </span>
		            <button>
		                <i class="fa fa-times" aria-hidden="true"></i>
		            </button>
		                         
		        </div>
		        <ul class="messages">
		            <li class="other">asdasdasasdasdasasdasdasasdasdasasdasdasasdasdasasdasdas</li>
		            <li class="other">Are we dogs??? 🐶</li>
		            <li class="self">no... we're human</li>
		            <li class="other">are you sure???</li>
		            <li class="self">yes.... -___-</li>
		            <li class="other">if we're not dogs.... we might be monkeys 🐵</li>
		            <li class="self">i hate you</li>
		            <li class="other">don't be so negative! here's a banana 🍌</li>
		            <li class="self">......... -___-</li>
		        </ul>
		        <div class="footer">
		            <div class="text-box" contenteditable="true" disabled="true"></div>
		            <button id="sendMessage">send</button>
		        </div>
		    </div>
		</div>
		<script src="./js/jquery.min.js"></script>
		<script src="./floatingChat.js"></script>
	</body>
</html>